Опис HTML тега <TABLE>:

Елемент <TABLE> служить контейнером для елементів, що визначають вміст таблиці. Будь-яка таблиця складається з рядків і осередків, які задаються за допомогою тегів <TR> і <TD>. Всередині <TABLE> допустимо використовувати наступні елементи: <CAPTION>, <COL>, <COLGROUP>, <TBODY>, <TD>, <TFOOT>, <TH>, <THEAD> і <TR>. Таблиці з невидимим кордоном довгий час використовувалися для верстки веб-сторінок, дозволяючи розділяти документ на модульні блоки. Подібний спосіб застосування таблиць знайшов втілення на багатьох сайтах, поки йому на зміну не прийшов більш сучасний спосіб верстки з допомогою шарів.

Синтаксис HTML тега <TABLE>:

Параметри HTML тега <TABLE>:

ALIGN - Для зображень та тексту можна вказувати їх положення щодо тексту або інших зображень на веб-сторінці. Спосіб вирівнювання задається параметром align тега. align='bottom | left | middle | right | top'

BACKGROUND - Визначає зображення, яке буде використовуватися в якості фонового малюнка. На відміну від звичайних зображень, для фону не встановлюються ширина і висота, і він завжди відображається у натуральну величину з масштабом 100%. Якщо малюнок за розміром менше вікна браузера, то картинка повторюється по горизонталі вправо і вниз, як мозаїка. З цієї причини на місці стику фонових картинок можуть виникнути видимі перепади, помітні для відвідувачів сайту. При виборі фонового малюнка переконайтеся, що забезпечений достатній контраст між ним і текстом веб-сторінки. В якості фону допускається використовувати анімовані зображення у форматі GIF, але вони відволікають увагу читачів.

BGCOLOR - Встановлює колір фону веб-сторінки. Можна використовувати цей параметр спільно з background, підібравши колір фону близький до фонового малюнку.

BORDER - Об'єкт, який розміщений на веб-сторінку, можна помістити в рамку різної ширини. Для цього служить параметр border. За замовчуванням рамка навколо не відображається за винятком випадку, коли малюнок є посиланням. При цьому колір рамки збігається з кольором посилань, заданих за допомогою стилю або параметра link тега <BODY>.

WIDTH - Для зміни розмірів засобами HTML передбачені параметри height і width. Допускається використовувати значення в пікселах або відсотках. Якщо встановлена процентна запис, то розміри зображення обчислюються щодо батьківського елементу - контейнера, де знаходиться тег <IMG>. У разі відсутності батьківського контейнера, в його якості виступає вікно браузера. Іншими словами, width = "100%" означає, що малюнок буде розтягнуто на всю ширину веб-сторінки. Додавання тільки одного параметра width або height зберігає пропорції і відношення сторін зображення. Браузер при цьому очікує повного завантаження малюнка, щоб визначити його первинну висоту і ширину. Обов'язково задавайте розміри всіх зображень на веб-сторінці. Це дещо прискорює завантаження сторінки, оскільки браузеру немає потреби обчислювати розмір кожного малюнка після його отримання. Це твердження особливо важливо для зображень, розміщених усередині таблиці. Ширину і висоту зображення можна змінювати як в меншу, так і велику сторону. Проте на швидкість завантаження малюнка це ніяк не впливає, оскільки розмір файлу залишається незмінним. Тому з обережністю зменшуйте зображення, тому що це може викликати здивування у читачів, чому такий маленький малюнок так довго вантажиться. А ось збільшення розмірів призводить до зворотного ефекту - розмір зображення великий, але файл щодо зображення аналогічного розміру завантажується швидше. Але якість малюнка при цьому погіршується.

HEIGHT - Для зміни розмірів зображення засобами HTML передбачені параметри height і width. Допускається використовувати значення в пікселах або відсотках. Якщо встановлена процентна запис, то розміри зображення обчислюються щодо батьківського елементу - контейнера, де знаходиться тег <IMG>. У разі відсутності батьківського контейнера, в його якості виступає вікно браузера. Іншими словами, width = "100%" означає, що малюнок буде розтягнуто на всю ширину веб-сторінки. Додавання тільки одного параметра width або height зберігає пропорції і відношення сторін зображення. Браузер при цьому очікує повного завантаження малюнка, щоб визначити його первинну висоту і ширину. Обов'язково задавайте розміри всіх зображень на веб-сторінці. Це дещо прискорює завантаження сторінки, оскільки браузеру немає потреби обчислювати розмір кожного малюнка після його отримання. Це твердження особливо важливо для зображень, розміщених усередині таблиці. Ширину і висоту зображення можна змінювати як в меншу, так і більшу сторону. Проте на швидкість завантаження малюнка це ніяк не впливає, оскільки розмір файлу залишається незмінним. Тому з обережністю зменшуйте зображення, тому що це може викликати здивування у читачів, чому такий маленький малюнок так довго вантажиться. А ось збільшення розмірів призводить до зворотного ефекту - розмір зображення великий, але файл щодо зображення аналогічного розміру завантажується швидше. Але якість малюнка при цьому погіршується.

CELLPADDING - Визначає відстань між межею комірки і її вмістом. Цей параметр додає порожній простір до осередку, збільшуючи тим самим її розміри. Без cellpadding текст у таблиці «налипає» на рамку, знижуючи тим самим його сприйняття. Додавання ж cellpadding дозволяє поліпшити читабельність тексту. При відсутності кордонів особливого значення цей параметр не має, але може допомогти, коли потрібно встановити порожній проміжок між осередками.

CELLSPACING - Задає відстань між зовнішніми межами осередків. Якщо встановлено параметр border, товщина кордону приймається в розрахунок.

BORDERCOLOR - Встановлює колір рамки таблиці. Рамка зазвичай малюється як тривимірна, додавання параметрів bordercolor і border до тегу <TABLE> створюють однотонну лінію.

FRAME - Повідомляє браузеру, як відображати межі навколо таблиці. Товщина кордону вказується за допомогою параметра border.

COLS - Параметр cols задає кількість стовпців в таблиці, допомагаючи браузеру в підготовці до її відображення. Без цього параметра таблиця буде показана тільки після того, як весь вміст таблиці буде додано в браузер і проаналізовано. Використання параметра cols дозволяє дещо прискорити відображення вмісту таблиці.

RULES - Повідомляє браузеру, де відображати кордон між осередками. Товщина кордону і її колір вказується за допомогою параметрів border і bordercolor. За замовчуванням рамка малюється навколо кожного осередку, утворюючи тим самим сітку.

Закриваючий тег:

обов'язковий

Додаткові відомості HTML тега <TABLE>:

HTML: 3.2 4 XHTML: 1.0 1.1